<div ng-controller='timepicker' ng-init="init()">
	<style>
		.timepicker-timestring {
			font-weight: normal;
		}

		.timepicker-dropdown {
			margin: 0px !important;
			border: 0px !important;
		}
	</style>
	<form name="input" style="margin:0">
		<ul class="nav timepicker-dropdown">

			<li class="grafana-menu-zoom-out">
				<a class='small' ng-click='zoom(2)'>
					Zoom Out
				</a>
			</li>

			<li class="dropdown">

				<a class="dropdown-toggle timepicker-dropdown"
				   data-toggle="dropdown" href="" bs-tooltip="time.tooltip"
				   data-placement="bottom" ng-click="dismiss();">
					<span ng-bind="time.rangeString"></span>
					<span ng-show="dashboard.refresh" class="text-warning">refreshed every {{dashboard.refresh}} </span>
					<i class="icon-caret-down"></i>
				</a>

				<ul class="dropdown-menu">
					<!-- Relative time options -->
					<li bindonce
						ng-repeat='timespan in panel.time_options track by $index'>
						<a ng-click="setRelativeFilter(timespan)"
						   bo-text="'Last ' + timespan"></a>
					</li>

					<!-- Auto refresh submenu -->
					<li class="dropdown-submenu">
						<a href="#">Auto-Refresh</a>
						<ul class="dropdown-menu">
							<li>
								<a ng-click="timeSrv.set_interval(false)">Off</a>
							</li>
							<li bindonce
								ng-repeat="interval in panel.refresh_intervals track by $index">
								<a ng-click="timeSrv.set_interval(interval)"
								   bo-text="'Every ' + interval"></a>
							</li>
						</ul>
					</li>
					<li><a ng-click="customTime()">Custom</a></li>
				</ul>

			</li>
			<li ng-show="!dashboard.refresh" class="grafana-menu-refresh">
				<a ng-click="timeSrv.refreshDashboard()"><i
						class="icon-refresh"></i></a>
			</li>
		</ul>
	</form>
</div>
